import type {
  LoadingConfig,
  AdaptiveConfig,
  PaginationProps
} from "@pureadmin/table";
import { ref, onMounted, reactive } from "vue";
import { isAllEmpty } from "@pureadmin/utils";
import {
  getUserTeamList,
  type UserTeamDataItem,
  type UserTeamData
} from "@/api/user";

export function useColumns(uId: number) {
  const dataList = ref<UserTeamDataItem[]>([]);
  const loading = ref(true);
  const columns: TableColumnList = [
    {
      label: "用户ID",
      prop: "id"
    },
    {
      label: "账号",
      prop: "account"
    },
    {
      label: "团队人数",
      prop: "teamNum"
    },
    {
      label: "团队业绩",
      prop: "teammoney"
    },
    {
      label: "我的业绩",
      prop: "mymoney"
    }
  ];

  const startTime = ref("");
  const endTime = ref("");
  const totalMoney = ref(0);
  const mymoney = ref(0);
  const teammoney = ref(0);

  /** 加载动画配置 */
  const loadingConfig = reactive<LoadingConfig>({
    text: "正在加载第一页...",
    viewBox: "-10, -10, 50, 50",
    spinner: `
        <path class="path" d="
          M 30 15
          L 28 17
          M 25.61 25.61
          A 15 15, 0, 0, 1, 15 30
          A 15 15, 0, 1, 1, 27.99 7.5
          L 15 15
        " style="stroke-width: 4px; fill: rgba(0, 0, 0, 0)"/>
      `
    // svg: "",
    // background: rgba()
  });

  /** 撑满内容区自适应高度相关配置 */
  const adaptiveConfig: AdaptiveConfig = {
    /** 表格距离页面底部的偏移量，默认值为 `96` */
    offsetBottom: 110
    /** 是否固定表头，默认值为 `true`（如果不想固定表头，fixHeader设置为false并且表格要设置table-layout="auto"） */
    // fixHeader: true
    /** 页面 `resize` 时的防抖时间，默认值为 `60` ms */
    // timeout: 60
    /** 表头的 `z-index`，默认值为 `100` */
    // zIndex: 100
  };

  function onKeywordChange(startTime_?: string, endTime_?: string) {
    if (isAllEmpty(startTime_) || isAllEmpty(endTime_)) {
      startTime.value = undefined;
      endTime.value = undefined;
    } else {
      startTime.value = `${startTime_} 00:00:00`;
      endTime.value = `${endTime_} 23:59:59`;
    }

    dataList.value = undefined;
    loadData();
  }

  function loadData() {
    return new Promise((resolve, reject) => {
      const params = {
        uId
      };
      if (!isAllEmpty(startTime.value)) {
        params["startTime"] = startTime.value;
      }
      if (!isAllEmpty(endTime.value)) {
        params["endTime"] = endTime.value;
      }
      getUserTeamList(params)
        .then(res => {
          const data = res.data;
          dataList.value = data.userZTList;
          loading.value = false;
          totalMoney.value = Number(data.totalMoney);
          teammoney.value = Number(data.teammoney);
          mymoney.value = Number(data.mymoney);
          resolve(res.data);
        })
        .catch(error => {
          reject(error);
        });
    });
  }

  onMounted(() => {
    loadData();
  });

  return {
    loading,
    columns,
    dataList,
    totalMoney,
    mymoney,
    teammoney,
    loadingConfig,
    adaptiveConfig,
    loadData,
    onKeywordChange
  };
}
